Kali cara membuat snippet dalam vs dgn copdingan flutter kita 
Misalkan b 


x] Fie Edit Selectic 


uat stl maka sudah bisa 


© maindart * 

v OPEN EDITORS 1 UNSAVED import 
*& 
FLUTTER APP 


void main = runApp(MyApp( ) 


5 st 
Flutter stateful widg.. 
Flutter stateless wid.. 
Flutter widget with A.. 
Stack 
StackFit BOYS) ELGG 
StackOverflowError _$1State createState() 
StackTrace = _$1State(); 
StadiumBorder } 
State 
StateError 
StatefulBuilder 
StatefulElement 


lass _$1State extends 
tate«$1» { 


goverride 


s 
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> OUTUNE 


> DEPENDENCIES 


PS E:\Dropbox\FlutterProject\flutter_app> 


© mindan * 
v OPEN EDITORS 1 UNSAVED import 
es 
FLUTTER APP : 
void main = runApp 


5 class | extends StatelessM 
@override 
Widget build(BuildContext context) { 
return Container( 


); 
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OUTUNE 
> DEPENDENCIES 


> 10005 PS E:\Dropbox\FlutterProject\flutter_app> 


Langusng dibuatkan 


Bagaiman caranya 

Agar mempersingkat lamanya coding 
Setelah itu buat material app 

Lalu hilangkan bener nya 


Lalu mainPage 
Dan buat class Mainpage ke tempatlain 


© mandat * 


OPEN EDITORS 1 UNSAVED import 
d 


FLUTTER APP 


dget build(Build ext context) 1 
return Mater ialApp( 
debugShowCheckedModeBanner: false, 


home: MainPage(), 
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PS E:\Dropbox\FlutterProject\flutter_app> 


Untuk ketik ini semua makan waktu bagaiman cara membuat sni 
Punya snipet yg ketik jadi sudah ada material app dan banner nya false 
Lalu cursor sudah ada di home 

Caranya cukup pergi 

Ke preferences lalu 

Usersnippet 


Pilih dart json 


v OPEN EDITORS 1 UNSAVED 
.. 
FLUTTER APP p 
void main = runApp(MyApp 


class M extends StatelessWidget 
gover C 
Nidget build(BuildContext context) { 
return MaterialApp( 
debugShowCheckedModeBanner: false, 
home: , 
); 
} 
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ourune 
DEPENDENCIES 
Tooos PS E:\Dropbox\FlutterProject\flutter_app> 


Buka nanti ada kurng awal {} 

Contoh buat snipet stl yg namanya myApp 
Seperti tadi yg dibuat 

Namanya "" :{ 

Lalu prefeix namanya "" 

Body sesuai yg di ketik divscodenya 

Vopy saja tulis ini pertama kali 


& mandat © 
v OPEN EDITORS 2 import 
*& 
a void main => runApp(MyApp( )); 
f 
5 lass MyApp extends StatelessWidget | 
@override 
Widget build(BuildContext context) { 
return MaterialApp( 
debugShowCheckedModeBanner: false, 
home: , 


)i 
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OUTUNE 
DEPENDENCIES 


TODOS PS E:\Dropbox\FlutterProject\flutter_app> 


[s | P Type here io ses 


Lalu baris kedua 
Tab nya X ini tab 
Lalu ketiga buat 
E | on View Go Debug 


dartjson © 


ao 


« OPEN EDITORS 2 UNSAVED 
ES si "Stateless MyApp": { 
FLUTTER APP “prefix": 


m ide "body": [ 


. 
= 
E 

& 
E 
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ouTune 
DEPENDENCIES 
TODOS PS E:\Dropbox\FlutterProject\flutter_app> 


Nanti sudah buat ini cursor otomatis di home 
Beri tanda $0 bertanda cursor akhir nya 


datjson * 
v OPEN EDITORS 2 UNSAVED 
-e 


© 1} dartjson 


"Stateless MyApp":{ 


FLUTTER APP | "prefix": 
WB idea "body": [ 


1 
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OUTUNE 
DEPENDENCIES 


TOROS PS E:\Dropbox\FlutterProject\flutter_app> 


Skearang kembli ke main 
Kita coba 

Sudah ada 
x] Fie NT 


€ maindat * 


e 


OPEN EDITORS 1 UNSAVED import 
.. 


EN void main => runApp 
M ides 
5 stlm 
Mstateless myapp 

SlidertTickMarkShape build(BuildCo 
SliderTheme context) { 
SliderThemeData eturn 
StatefulElement MaterialApp( 
StatelessElement 
StreamBuilder debugShowCheckedModeBann 
StreamBuilderBase er: false, 
ImageStreamlistener home: , 
RangeSliderTickMark ); 
RoundRangeS iderTick 
RoundSliderTickMarkSh 
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? OUTUNE 
DEPENDENCIES 


— PS E:Dropbox“FlutterProject/flutter app» 


Maka sudah deh jadi 
Untuk berikutnya selain buat snippet kita bisa juga buat seperti ini 


& maindart * 


v OPEN EDITORS 1 UNSAVED return MaterialApp( 
9 Q mindan debugShowCheckedModeBanner : 
as home: MainPag 


FLUTTER APP 


)i 


15 class e| extends 
@override 
MainPas e createState() = _MainPag 


class _MainPageState extends State<MainPagep 
goverride 
dget build(B iContext context) { 
return Cont 


); 
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OUTUNE 
DEPENDENCIES 


PS E:\Dropbox\FlutterProject\flutter_app> 


Ini cursor ada 3 sesamaan 
Ada lagi sperti ini ketika ditab diisi 
xj Fie ion View Go Deb nal Help 


Teer 


& mandat * 
v OPEN EDITORS 1 UNSAVED return Mater 
ON debugShowCheckedModeBanner: false, 
il home: ! 
FLUTTER App 
m id ); 


class MainPage extends Statef 
goverride 
> createState() => 


class _MainPageStat extends S 
override 
Widget build(BuildContext context) { 
return Contai ( 
margin: Ed its.fromLTRB(left, top, right, bottom), 
); 
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OUTUNE 
> DEPENDENCIES 


10005 PS E:\Dropbox\FlutterProject\flutter_app> 


Contoh buat snipper untuk stl widget 


Kita buat seperti ini dalam scafold ada appbar setalh isi 
Maka pindah ke body 


& mandar 


v OPEN EDITORS 1 UNSAVED return MaterialApp( 


os debugShowCheckedModeBanner: false, 


nPage 
FLUTTER APP 4 


j 


class MainPage extends St 
override 
iget build(BuildContext context) { 
return Scaffold( 
appBar: , 
body: , 
); 
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? OUTUNE 
DEPENDENCIES 


» 10005 PS £:\Dropbox\FlutterProject\flutter_app> 


Kita buat 


Maka disini tambah koma , 
Buat steles page 

$1 untuk cursor pertama 
Kalau $0 untu 


k posisi terakhir 


& . dartjson 
v OPEN EDITORS 2 UNSAVED 
-e 
x jart json 
FLUTTER App 


m id 


h 

"Stateless Page":{ 
"prefix": 
"body": [ 
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OUTUNE 
DEPENDENCIES 


> T0005 PS E:\Dropbox\FlutterProject\flutter_app> 
|: EXT i 
Sekarang kita buat 
Buat 


© main.dart 
v OPEN EDITORS WUVELLLUC 
X & maindart st Widget build(BuildContext context) { 
== return MaterialApp( 
debugShowCheckedModeBanner: false, 
home: MainPage : 


); 


FLUTTER APP 


class MainPage extends StatelessWidge 
override 
Nidget build(BuildContext context) 
return Scaffol 
appBar: App 


body: Container 
); 
} 


1: powershell 
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OUTUNE 


DEPENDENCIES 


> TODOS PS E:\Dropbox\FlutterProject\flutter_app> 


a | P Ipa here io search 


Maka seperti ni 

Kalau ada cursor 2x maka buat $ dolar yg sama 

Berikutnya buat perti si margin ada paramter yg bisa ganti2 
Buat buah snipet 

Cerita nya untuk mempersingkat buat field dan seter dan geeter 
Contoh 

Kasih agar k bisa diakses dari luark bisa diakses dari luar 

Buat seperti ini 


Q & mindan * 
OPEN EDITORS 1UNSAVED CLASS mc Fat extendas statet 
© © mandan i aove Pm 
- Widget build(BuildContext context) { 
FLUTTER APP 
return S« 


appBar: 
title 


s 
body: Con 


class Per 


String _name; 


void setName(String value) { _name = value; } 
String getName() = name; 
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ouTune 


DEPENDENCIES 


PS E:\Dropbox\FlutterProject\flutter_app> 


Lalu ke jso 


dartjson 

v OPEN EDITORS 1 UNSAVED 
*& 
X (.) dartjson 


FLUTTER APP 


} 

"Field Get Set":{ 
“prefix": 
"body": [ 


] 
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ourune 


> DEPENDENCIES 


> TODOS PS E:\Dropbox\FlutterProject\flutter_app> 


|: EXT 


Lalu buat seperti ini 


V OPEN EDITORS 1 UNSAVED 
*& 
jart 
FLUTTER APP 


M idea 


); 


fgs 

Str Dfield get set 
FlutterLogoStyle 

voi #FocusHighlightstrategy 

tr #FocusHighlightMode 
HeroFlightShuttleBuil.. 
FocusManager 
MultiframeImageStrean... 
OneFrameImageStreamCo. 
FadeUpwardsPaseTransi... 

Windows Po\%FlexibleSpaceBarSetti.. 
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fieldType _fieldName; 
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OUTLINE 
> DEPENDENCIES 


PS E:\Dropbox\FlutterProject\flutter_app> 


& maindat * 
v OPEN EDITORS 1 UNSAVED Class Mal 
0. goverride 
- et build 
return 
appBar 
title: 


FLUTTER APP 
M ide 


, 


body: 


class Person 
27 fieldType _fieldName; 
String name, 


void setName(String value) { name = value; } 
String getName() = name; 
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> OUTUNE 
DEPENDENCIES ' £ 
:\Dropbox\FlutterProject\flutter_app> 


Paramter nya apa 
Sekarang lanjutan tadi 


Lj dartjson 
v OPEN EDITORS 1 UNSAVED 
-e 
X (.) dartjson 
FLUTTER APP 
i: 


| Get Set":{ 

refi 

dy": [ 
"$11: fi 
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OUTUNE 
DEPENDENCIES 


> T0005 PS E:\Dropbox\FlutterProject\flutter_app> 


|: a 


Maka disni isa buat otomatis 


maindat * 
v OPEN EDITORS 1 UNSAVED 
EI 


4 context 
FLUTTER APP $n» 
m id 


. 
. 
= 


_ fieldName; 


setterName(in value _fieldName = value; 
getterName =  fieldName; 


^ 
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OUTUNE 
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score6 
PS E:\Dropbox\FlutterProject\flutter_app> 
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